SherbyNet - /page/wikibook/entry.mu

Micron Document

<!DOCTYPE html>

<title>Selection (user interface)</title>

</head>

<span id="openzim-page-title" class="mw-page-title-main"><span class="mw-page-title-main">Selection (user interface)</span></span>

</h1>

</header>

<p>In <a href="Computing" title="Computing">computing</a> and <a href="User_interface_design" title="User interface design">user interface engineering</a>, a <b>selection</b> is a list of items on which <a href="Command_(computing)" title="Command (computing)">user operations</a> will take place. The user typically adds items to the list manually, although the <a href="Computer" title="Computer">computer</a> may create a selection automatically.

</p><p>Selections are enacted through combinations of key presses on a <a href="Computer_keyboard" title="Computer keyboard">keyboard</a>, with a precision <a href="Pointing_device" title="Pointing device">pointing device</a> (<a href="Mouse_(computing)" class="mw-redirect" title="Mouse (computing)">mouse</a> or <a href="Touchpad" title="Touchpad">touchpad</a> and <a href="Cursor_(computers)" class="mw-redirect" title="Cursor (computers)">cursor</a>, <a href="Stylus_(computing)" title="Stylus (computing)">stylus</a>), or by hand on a <a href="Touchscreen" title="Touchscreen">touchscreen</a> device. The simultaneous selection of a group of items (either a subset of elements in a list, or discontinuous regions in a text) is called a <i>multiple selection</i>.

</p><p><a href="Context_menu" title="Context menu">Context menus</a> will usually include actions related to the objects included in the current selection – the selection provides the "context" for the menu.

</p>

<div class="mw-heading mw-heading2"><h2 id="Types">Types</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .ambox{border:1px solid #a2a9b1;border-left:10px solid #36c;background-color:#fbfbfb;box-sizing:border-box}.mw-parser-output .ambox+link+.ambox,.mw-parser-output .ambox+link+style+.ambox,.mw-parser-output .ambox+link+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+style+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+link+.ambox{margin-top:-1px}html body.mediawiki .mw-parser-output .ambox.mbox-small-left{margin:4px 1em 4px 0;overflow:hidden;width:238px;border-collapse:collapse;font-size:88%;line-height:1.25em}.mw-parser-output .ambox-speedy{border-left:10px solid #b32424;background-color:#fee7e6}.mw-parser-output .ambox-delete{border-left:10px solid #b32424}.mw-parser-output .ambox-content{border-left:10px solid #f28500}.mw-parser-output .ambox-style{border-left:10px solid #fc3}.mw-parser-output .ambox-move{border-left:10px solid #9932cc}.mw-parser-output .ambox-protection{border-left:10px solid #a2a9b1}.mw-parser-output .ambox .mbox-text{border:none;padding:0.25em 0.5em;width:100%}.mw-parser-output .ambox .mbox-image{border:none;padding:2px 0 2px 0.5em;text-align:center}.mw-parser-output .ambox .mbox-imageright{border:none;padding:2px 0.5em 2px 0;text-align:center}.mw-parser-output .ambox .mbox-empty-cell{border:none;padding:0;width:1px}.mw-parser-output .ambox .mbox-image-div{width:52px}@media(min-width:720px){.mw-parser-output .ambox{margin:0 10%}}@media print{body.ns-0 .mw-parser-output .ambox{display:none!important}}

/* end https://en.wikipedia.org/ */

</style>

<ul><li><a href="Electronic_text" class="mw-redirect" title="Electronic text">Text</a> selection is associated with the <a href="Cut%2C_copy_and_paste" class="mw-redirect" title="Cut, copy and paste">cut, copy and paste</a> operations and done with a <a href="Cursor_(computers)" class="mw-redirect" title="Cursor (computers)">cursor</a>, <a href="Caret_navigation" title="Caret navigation">caret navigation</a> or <a href="Touchscreen" title="Touchscreen">touch</a>.</li>

<li><a href="Image_editing" title="Image editing">Image editing</a> applications can feature specialized graphical tools for the selection and modification of areas and shapes or to interact with colours, such as the <a href="Magic_wand_selection" class="mw-redirect" title="Magic wand selection">magic wand selection</a> tool, the <a href="Lasso_tool" title="Lasso tool">lasso</a> selection tool, the <a href="Marquee_selection" class="mw-redirect" title="Marquee selection">marquee selection</a> (<a href="Bounding_box" class="mw-redirect" title="Bounding box">bounding box</a>), or the <a href="Color_picker" title="Color picker">color picker</a>. The border of a selected area in an image is often animated with the <a href="Marching_ants" title="Marching ants">marching ants</a> effect to help the user to distinguish the selection border from the image background.</li>

<li><a href="Video_editing" title="Video editing">Video editing</a> programs may utilise dynamic controls and advanced <a href="Visual_effects" title="Visual effects">digital effects</a> on the selected region.</li>

<li><a href="Folder_(computing)" class="mw-redirect" title="Folder (computing)">Files</a> and other interface components can be selected and used with the advent of <a href="GUI" class="mw-redirect" title="GUI">GUIs</a>.</li>

<li><a href="3D_user_interaction" class="mw-redirect" title="3D user interaction">Selection and manipulation in 3D virtual environments</a></li></ul>

<div class="mw-heading mw-heading3"><h3 id="Range_selection">Range selection</h3></div>

<p>A selection method to facilitate the selection of large amounts of text or items in a long list such as files and folders in <a href="File_manager" title="File manager">file managers</a> is <i>range selection</i>, sparing the user from clicking or tapping each item individually.

</p><p>On desktop file managers such as the <a href="Windows_Explorer" class="mw-redirect" title="Windows Explorer">Windows Explorer</a> and <a href="Nemo_(file_manager)" title="Nemo (file manager)">Nemo file manager</a>, it can be used by clicking on the first item to be selected, then holding the <kbd>⇧</kbd> <a href="Shift_key" title="Shift key">shift key</a> while clicking on the last item to be selected. In mobile file managers, it is implemented since early versions of <a href="ES_File_Explorer#Popularization_and_functionality" title="ES File Explorer">ES File Explorer</a>, where only two listed items (file or directory) need to be highlighted and a button pressed to select all items in-between.

</p><p>Ideally, the two list items are navigated to with a draggable <a href="Scroll_bar" class="mw-redirect" title="Scroll bar">scroll bar</a>, since it can move through long lists faster.

</p>

<div class="mw-heading mw-heading3"><h3 id="Selection_with_dragging">Selection with dragging</h3></div>

<p>The user taps or clicks on the first item, drags upward or downward, and waits for the list to scroll to the last desired item, at which the user releases the pointer or finger. The same applies to text.<sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span class="cite-bracket">[</span>1<span class="cite-bracket">]</span></a></sup>

</p>

<div class="mw-heading mw-heading2"><h2 id="Simultaneous_editing">Simultaneous editing</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hatnote{font-style:italic}.mw-parser-output div.hatnote{padding-left:1.6em;margin-bottom:0.5em}.mw-parser-output .hatnote i{font-style:normal}.mw-parser-output .hatnote+link+.hatnote{margin-top:-0.5em}@media print{body.ns-0 .mw-parser-output .hatnote{display:none!important}}

/* end https://en.wikipedia.org/ */

</style><div role="note" class="hatnote navigation-not-searchable">Main article: <a href="Simultaneous_editing" title="Simultaneous editing">Simultaneous editing</a></div>

<p>Simultaneous editing is a technique in <a href="End-user_development" title="End-user development">End-user development</a> research to edit all items in a multiple selection. It allows the user to manipulate all the selected items at once through <a href="Direct_manipulation" class="mw-redirect" title="Direct manipulation">direct manipulation</a>. The technique also appears in <a href="Data_wrangling" title="Data wrangling">data wrangling</a> tools, allowing the user to make the same changes to several records of the same kind in a table.

</p><p>The term <i>simultaneous editing</i> is also used to describe <a href="Collaborative_editing" title="Collaborative editing">collaborative editing</a> in <a href="Collaborative_real-time_editor" title="Collaborative real-time editor">collaborative real-time editors</a>.

</p>

<div class="mw-heading mw-heading3"><h3 id="Column_selection">Column selection</h3></div>

<p>A <b>column selection</b> is a <a href="Text_selection" class="mw-redirect" title="Text selection">text selection</a> feature found in <a href="Text_editor" title="Text editor">text editors</a> which allows the user to select characters in a grid-like fashion, selecting characters in several lines at the same columns. This is usually initiated by pressing the alt key (instead of the shift key, which creates a continuous selection) to select text when <a href="Drag-and-drop" class="mw-redirect" title="Drag-and-drop">dragging</a>. Some applications also enable text to be typed in multiple lines at once using this method as a limited form of <a href="Simultaneous_editing" title="Simultaneous editing">simultaneous editing</a>.<sup id="cite_ref-npp_2-0" class="reference"><a href="#cite_note-npp-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup>

</p><p>The feature is known by different names in different applications:

</p>

<ul><li><b>block selection</b> – <a href="LibreOffice_Writer" title="LibreOffice Writer">LibreOffice Writer</a>,<sup id="cite_ref-3" class="reference"><a href="#cite_note-3"><span class="cite-bracket">[</span>3<span class="cite-bracket">]</span></a></sup> <a href="Kate_(text_editor)" title="Kate (text editor)">Kate</a><sup id="cite_ref-4" class="reference"><a href="#cite_note-4"><span class="cite-bracket">[</span>4<span class="cite-bracket">]</span></a></sup></li>

<li><b>column selection</b> – EditPlus,<sup id="cite_ref-5" class="reference"><a href="#cite_note-5"><span class="cite-bracket">[</span>5<span class="cite-bracket">]</span></a></sup> <a href="Vim_(text_editor)" title="Vim (text editor)">vi</a>, <a href="Emacs" title="Emacs">Emacs</a></li>

<li><b>non-linear text selection</b> – <a href="TextEdit" title="TextEdit">TextEdit</a><sup id="cite_ref-6" class="reference"><a href="#cite_note-6"><span class="cite-bracket">[</span>6<span class="cite-bracket">]</span></a></sup></li>

<li><b>rectangular selection</b> – <a href="JEdit" title="JEdit">jEdit</a><sup id="cite_ref-7" class="reference"><a href="#cite_note-7"><span class="cite-bracket">[</span>7<span class="cite-bracket">]</span></a></sup></li>

<li><b>column block selection</b> – <a href="Microsoft_Visual_Studio" class="mw-redirect" title="Microsoft Visual Studio">Microsoft Visual Studio</a><sup id="cite_ref-8" class="reference"><a href="#cite_note-8"><span class="cite-bracket">[</span>8<span class="cite-bracket">]</span></a></sup></li>

<li><b>column mode editing</b> – <a href="Notepad%2B%2B" title="Notepad++">Notepad++</a><sup id="cite_ref-npp_2-1" class="reference"><a href="#cite_note-npp-2"><span class="cite-bracket">[</span>2<span class="cite-bracket">]</span></a></sup></li></ul>

<div class="mw-heading mw-heading3"><h3 id="Free-form_simultaneous_editing">Free-form simultaneous editing</h3></div>

<p>The <a href="Lapis_(text_editor)" title="Lapis (text editor)">Lapis text editor</a>,<sup id="cite_ref-9" class="reference"><a href="#cite_note-9"><span class="cite-bracket">[</span>9<span class="cite-bracket">]</span></a></sup><sup id="cite_ref-10" class="reference"><a href="#cite_note-10"><span class="cite-bracket">[</span>10<span class="cite-bracket">]</span></a></sup> Mozilla's <a href="Firefox_developer_tools" class="mw-redirect" title="Firefox developer tools">Firefox developer tools</a>,<sup id="cite_ref-11" class="reference"><a href="#cite_note-11"><span class="cite-bracket">[</span>11<span class="cite-bracket">]</span></a></sup> and the <i>multi edit</i><sup id="cite_ref-12" class="reference"><a href="#cite_note-12"><span class="cite-bracket">[</span>12<span class="cite-bracket">]</span></a></sup> plugin for <a href="Gedit" title="Gedit">gedit</a> are examples of the simultaneous editing technique that work on discontinuous regions through direct manipulation. The Lapis editor can also create an automatic multiple selection based on an example item.

</p>

<ul><li><a href="Focus_(computing)" title="Focus (computing)">Focus (computing)</a></li></ul>

<div class="mw-heading mw-heading2"><h2 id="Notes">Notes</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .reflist{margin-bottom:0.5em;list-style-type:decimal}@media screen{.mw-parser-output .reflist{font-size:90%}}.mw-parser-output .reflist .references{font-size:100%;margin-bottom:0;list-style-type:inherit}.mw-parser-output .reflist-columns-2{column-width:30em}.mw-parser-output .reflist-columns-3{column-width:25em}.mw-parser-output .reflist-columns{margin-top:0.3em}.mw-parser-output .reflist-columns ol{margin-top:0}.mw-parser-output .reflist-columns li{page-break-inside:avoid;break-inside:avoid-column}.mw-parser-output .reflist-upper-alpha{list-style-type:upper-alpha}.mw-parser-output .reflist-upper-roman{list-style-type:upper-roman}.mw-parser-output .reflist-lower-alpha{list-style-type:lower-alpha}.mw-parser-output .reflist-lower-greek{list-style-type:lower-greek}.mw-parser-output .reflist-lower-roman{list-style-type:lower-roman}

/* end https://en.wikipedia.org/ */

</style><div class="reflist reflist-lower-alpha">

</div>

<div class="mw-heading mw-heading2"><h2 id="References">References</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output cite.citation{font-style:inherit;word-wrap:break-word}.mw-parser-output .citation q{quotes:"\"""\"""'""'"}.mw-parser-output .citation:target{background-color:rgba(0,127,255,0.133)}.mw-parser-output .id-lock-free.id-lock-free a{background:url("./mw/Lock-green.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-limited.id-lock-limited a,.mw-parser-output .id-lock-registration.id-lock-registration a{background:url("./mw/Lock-gray-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-subscription.id-lock-subscription a{background:url("./mw/Lock-red-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .cs1-ws-icon a{background:url("./mw/Wikisource-logo.svg")right 0.1em center/12px no-repeat}body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-free a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-limited a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-registration a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-subscription a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .cs1-ws-icon a{background-size:contain;padding:0 1em 0 0}.mw-parser-output .cs1-code{color:inherit;background:inherit;border:none;padding:inherit}.mw-parser-output .cs1-hidden-error{display:none;color:var(--color-error,#d33)}.mw-parser-output .cs1-visible-error{color:var(--color-error,#d33)}.mw-parser-output .cs1-maint{display:none;color:#085;margin-left:0.3em}.mw-parser-output .cs1-kern-left{padding-left:0.2em}.mw-parser-output .cs1-kern-right{padding-right:0.2em}.mw-parser-output .citation .mw-selflink{font-weight:inherit}@media screen{.mw-parser-output .cs1-format{font-size:95%}html.skin-theme-clientpref-night .mw-parser-output .cs1-maint{color:#18911f}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .cs1-maint{color:#18911f}}

/* end https://en.wikipedia.org/ */

</style><cite id="CITEREFNield2022" class="citation web cs1">Nield, David (14 October 2022). <a rel="nofollow" class="external text" href="https://www.popsci.com/diy/how-to-select-all-text/">"The best ways to select text on your phone and computer"</a>. <i>Popular Science</i><span class="reference-accessdate">. Retrieved <span class="nowrap">30 September</span> 2024</span>.</cite></span>

</li>

<li id="cite_note-npp-2"><span class="mw-cite-backlink">^ <a href="#cite_ref-npp_2-0"><sup><i><b>a</b></i></sup></a> <a href="#cite_ref-npp_2-1"><sup><i><b>b</b></i></sup></a></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://notepad-plus-plus.org/features/column-mode-editing.html">Notepad++ Column Mode Editing</a></span>

</li>

<li id="cite_note-3"><span class="mw-cite-backlink"><b><a href="#cite_ref-3">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://help.libreoffice.org/Writer/Selection_Mode">Writer/Selection Mode – LibreOffice Help</a></span>

</li>

<li id="cite_note-4"><span class="mw-cite-backlink"><b><a href="#cite_ref-4">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://docs.kde.org/stable/en/applications/kate/kate-part-selection.html">The Kate Handbook</a> <a rel="nofollow" class="external text" href="https://web.archive.org/web/20140512220601/http://docs.kde.org/stable/en/applications/kate/kate-part-selection.html">Archived</a> 2014-05-12 at the <a href="Wayback_Machine" title="Wayback Machine">Wayback Machine</a></span>

</li>

<li id="cite_note-5"><span class="mw-cite-backlink"><b><a href="#cite_ref-5">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://editplus.info/wiki/FAQ">FAQ – EditPlus Wiki</a></span>

</li>

<li id="cite_note-6"><span class="mw-cite-backlink"><b><a href="#cite_ref-6">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://hints.macworld.com/article.php?story=20050509093516708">10.4: Use non-linear text selection in TextEdit</a></span>

</li>

<li id="cite_note-7"><span class="mw-cite-backlink"><b><a href="#cite_ref-7">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://www.jedit.org/users-guide/selection.html">Selecting Text – jEdit</a></span>

</li>

<li id="cite_note-8"><span class="mw-cite-backlink"><b><a href="#cite_ref-8">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="https://msdn.microsoft.com/en-us/library/aa265698%28v=vs.60%29.aspx">Selecting Text – MSDN</a></span>

</li>

<li id="cite_note-9"><span class="mw-cite-backlink"><b><a href="#cite_ref-9">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="https://www.cs.cmu.edu/~rcm/papers/chi02/chi02.html">LAPIS: Smart Editing with Text Structure</a></span>

</li>

<li id="cite_note-10"><span class="mw-cite-backlink"><b><a href="#cite_ref-10">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://www.usenix.org/event/usenix99/full_papers/miller/miller_html/usenix99.html">Lightweight Structured Text Processing</a></span>

</li>

<li id="cite_note-11"><span class="mw-cite-backlink"><b><a href="#cite_ref-11">^</a></b></span> <span class="reference-text"><cite id="CITEREFHeather_Arthur_and_Robert_Nyman2014" class="citation web cs1">Heather Arthur and Robert Nyman (May 7, 2014). <a rel="nofollow" class="external text" href="https://hacks.mozilla.org/2014/05/editable-box-model-multiple-selection-sublime-text-keys-much-more-firefox-developer-tools-episode-31/">"Editable box model, multiple selection, Sublime Text keys + much more – Firefox Developer Tools Episode 31"</a>. Mozilla<span class="reference-accessdate">. Retrieved <span class="nowrap">7 May</span> 2014</span>.</cite></span>

</li>

<li id="cite_note-12"><span class="mw-cite-backlink"><b><a href="#cite_ref-12">^</a></b></span> <span class="reference-text"><a rel="nofollow" class="external text" href="http://blogs.gnome.org/jessevdk/2009/11/15/new-gedit-plugin-multi-edit/">New gedit plugin: multi edit</a>, and a <a rel="nofollow" class="external text" href="https://people.gnome.org/~jessevdk/multiedit.ogv">demo video</a>.</span>

</li>

</ol></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .asbox{position:relative;overflow:hidden}.mw-parser-output .asbox table{background:transparent}.mw-parser-output .asbox p{margin:0}.mw-parser-output .asbox p+p{margin-top:0.25em}.mw-parser-output .asbox-body{font-style:italic}.mw-parser-output .asbox-note{font-size:smaller}.mw-parser-output .asbox .navbar{position:absolute;top:-0.75em;right:1em;display:none}.mw-parser-output :not(p):not(.asbox)+style+.asbox,.mw-parser-output :not(p):not(.asbox)+link+.asbox{margin-top:3em}

/* end https://en.wikipedia.org/ */

</style></div><div><div class="zim-footer">

This article is issued from <a class="external text" title="Last edited on 2025-07-01" href="https://en.wikipedia.org/wiki/?title=Selection_(user_interface)&oldid=1298222928">Wikipedia</a>. The text is available under <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-Share Alike 4.0</a> unless otherwise noted. Additional terms may apply for the media files.

</div>

</div></div>

</div>

</main>

</div>

</body></html>